<template>
	<view class="location">
		<view class="line"></view>
			<view class="list" @click="changeProvince">
				<text>中国</text>
				<view class="right">
					<text>{{areaName}}</text>
					<image class="icon-arrow" src="../../static/images/icon-right-arrow.png"></image>
				</view>
			</view>
			<view class="tips">
				*注：点击选择出生地
			</view>
	</view>
</template>

<script setup>
	import {onShow} from "@dcloudio/uni-app"
import { ref } from "vue";
	const areaName=ref("")
	const changeProvince=()=>{
		uni.navigateTo({
			url:"./changeProvince"
		})
	}
	onShow(()=>{
		areaName.value=uni.getStorageSync("areaName")
	})
</script>

<style scoped lang="scss">
	       .location{
			   .line{
			      height: 1px;
			      background-color: #252731;
			   }
			   .list{
				   display: flex;
				   justify-content: space-between;
				   background-color: #4A4C52;
				   margin-top: 40rpx;
				   padding:20rpx;
			   }
			   .right{
				   display: flex;
				   align-items: center;
			   }
			   .icon-arrow{
				   width: 32rpx;
				   height: 32rpx;
				   margin-left: 10rpx;
			   }
			   .tips{
			   	padding:20rpx;
			   	color: #ddd;
			   }
		   }
</style>
